<div class="userinfo_bar">
	<b class="f14">您好，<span id="account"></span>！欢迎回来!
	</b>
</div>
<div class="box clearfix">
	<h3>用户信息</h3>
	<dl class="userinfo_box">
		<dt>
			<form enctype="multipart/form-data" id="upavatar">
				<input type="hidden" name="opr" value="update">
				<input type="hidden" name="type" value="2">
				<input type="file" id="avatar" name="avatar" hidden />
			</form>

			<a class="ico"><img id="user_ico_img" src="" width="100" height="100" alt="" /></a> <a class="blue"
				href="javascript:void(0)" id="changeAvatar"> 修改头像</a>
		</dt>
		<dd>
			<table width="100%" cellpadding="0" cellspacing="0">
				<col width="350px" />
				<tr>
					<td>你的订单交易总数量：<b class="red2" id="allOrders">0 笔</b>&nbsp;&nbsp;&nbsp;<a class="blue orderlist"
							href="javascript:$('#main').load('order_list.html');">进入订单列表</a></td>
				</tr>
				<tr>
					<td>总消费额：<b class="red2" id="allmanay">￥0.00</b></td>

				</tr>
				<tr>
					<td>剩余积分：<b class="red2" id="integer">0</b></td>

				</tr>
				<tr>
					<td>账号注册时间：<b id="regtime">0</b></td>

				</tr>
			</table>

			<div class="stat">
				<span>待评价订单：<label>(<b class="red2" id="notEvaluateNums">1</b>)
					</label></span> <span>待付款订单：<label>(<b class="red2" id="notGetMoneyNums">0</b>)
					</label></span> <span>待确认收货：<label>(<b class="red2" id="notConfirmNums"><a href="">0</a></b>)
					</label></span>
			</div>
		</dd>
	</dl>
</div>
<h3 class="bg">我的订单</h3>
<div class="box m_10">
	<table class="list_table" width="100%" cellpadding="0" cellspacing="0">
		<col width="250px" />
		<col width="140px" />
		<thead>
			<tr>
				<th>订单编号</th>
				<th>下单日期</th>
				<th>收货人</th>
				<th>支付方式</th>
				<th>总金额</th>
				<th>订单状态</th>
			</tr>
		</thead>
		<tbody id="orderData"> </tbody>
		<tfoot>
			<tr>
				<td colspan="6" class="t_r"><a class="blue orderlist"
						href="javascript:$('#main').load('order_list.html');">更多订单&gt;&gt;</a></td>
			</tr>
		</tfoot>
	</table>
</div>
<!-- 用户信息 -->
<script>
	$(function () {
		$.ajax({
			type: "get",
			url: "/user",
			dataType: "json",
			data: "opr=select",
			beforeSend: function (r) {
				//加载层-默认风格
				layer.load();
			},
			success: function (result, status, xhr) {
				console.log(result);
				$("#user_ico_img").prop("src", "/" + result.img);
				$("#account").text(result.username);
				$("#integer").text(result.integral);
				$("#regtime").text(result.regTime);
				$("#allOrders").text(result.allOrderNums + "笔");
				$("#allmanay").text("￥" + result.allMoney);
				$("#notEvaluateNums").text(result.notEvaluateNums);
				$("#notGetMoneyNums").text(result.notGetMoneyNums);
				$("#notConfirmNums").text(result.notConfirmNums);
			},
			complete: function (XMLHttpRequest, textStatus) {
				// alert('远程调用成功，状态文本值：'+textStatus);
				layer.closeAll('loading');
			},
			error: function () {
				layer.msg('系统繁忙，请稍后再试', { icon: 2 });
			}
		})
	})

</script>
<!-- 订单信息 -->
<script>
	$(function () {

		$.ajax({
			type: "get",
			url: "/order",
			data: "opr=list&p=1",
			dataType: "json",
			beforeSend: function (r) {
				//加载层-默认风格
				layer.load();
			},
			success: function (result, status, xhr) {
				let s = template("orderTpl", { data: result.data });
				$("#orderData").append(s);
			},
			complete: function (XMLHttpRequest, textStatus) {
				// alert('远程调用成功，状态文本值：'+textStatus);
				layer.closeAll('loading');
			},
			error: function () {
				layer.msg('系统繁忙，请稍后再试', { icon: 2 });
			}
		})
	})
</script>

<script id="orderTpl" type="text/html">
	{{each data as order}}
	 <tr>
	 <td><a href="javascript:void(0)" class="menu" onclick="details({{order.id}})">{{order.ordersId}}</a></td>
	 <td>{{order.times}}</td>
	 <td>{{order.conSingnee}}</td>
	 <td>
		 {{if order.payMethod==1}} 支付宝 {{/if}}
		 {{if order.payMethod==2}} 微信 {{/if}}
		 {{if order.payMethod==3}} 货到付款 {{/if}}
		 </td>
	 <td>{{order.totalMoney}}<b style="color: rgb(226, 103, 46);">￥</b></td>
	 <td>
		 {{if order.state==1}} <b style="color: red;">待付款</b> {{/if}}
		 {{if order.state==2}} 待发货 {{/if}}
		 {{if order.state==3}} 已发货 {{/if}}
		 {{if order.state==4}} 已完成 {{/if}}
		 {{if order.state==5}} 退货中 {{/if}}
		 {{if order.state==6}} 同意退货 {{/if}}
		 {{if order.state==7}} 不同意退货 {{/if}}
		 {{if order.state==8}} 退货成功 {{/if}}
		 </td>
 </tr>
	 {{/each}}
</script>

<script>
	$(function () {
		$("#changeAvatar").click(function () {
			$("#avatar").click();
		})
	})
	$("#avatar").change(function (e) {
		var sc = $("#avatar").get(0).files[0];
		if (sc) {
			upload_img();
		}
	})
	function upload_img() {
		var formData = new FormData();
		formData.append("file", document.getElementById("avatar").files[0]);
		$.ajax({
			url: '/user?opr=update&type=2',
			data: formData,
			type: "post",
			dataType: "json",
			processData: false, //必须false才会避开jQuery对 formdata 的默认处理 XMLHttpRequest会对 formdata 进行正确的处理
			contentType: false, //必须false才会自动加上正确的Content-Type
			beforeSend: function (r) {
				//加载层-默认风格
				layer.load();
			},
			success: function (r, states, xh) {
				if (r.msg == 'ok') {
					layer.msg("头像修改成功", { icon: 1 });
					$("#user_ico_img").prop("src", "/" + r.img);

				} else {
					layer.msg("<em style='color:red'>" + r.msg + "</em>", { time: 1200, icon: 5 });
				}
			},
			complete: function (XMLHttpRequest, textStatus) {
				// alert('远程调用成功，状态文本值：'+textStatus);
				layer.closeAll('loading');
			},
			error: function () {
				layer.msg("系统繁忙，请稍后再试", { icon: 2 });
			}
		});
	}
</script>